/*html {
    overflow: auto;
    min-width: 60em;
    min-height: 20em;
    resize: both;
    }*/

.autosave_options {
    background: linear-gradient(to right, white, black 4em , black 4.5em , white 10em);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
    transition-property: background;
    transition-duration: 1s;
    transition-timing-function: ease-out;
    }

.autosave_logo_options {
        display: none;
    background: linear-gradient(to right, white, black 1em);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
    transition-property: background;
    transition-duration: 1s;
    transition-timing-function: ease-out;
    }

.toast {
  	margin: 0.5em;
    display: block;
     border-radius: 0.5em;
    padding: 0.5em;
    background-color: gray;
    color: white;
    font-size: small;
	opacity: 0.5;
  }

section.anchor {
	position: fixed;
	top: 0;
	background: white;
	width: 100%;
	/*opacity: 0.98;*/
	}

.version {
    position: fixed;
    top: 3.5em;
    left: 1em;
	font-size: small;
    }

.links {
    position: fixed;
    top: 0;
    right: 0;
    opacity:0.5;
	font-size: small;
    }

span+p.tooltip_timeout {
  	margin: 0.5em;
    position: fixed;
        display: none;
     border-radius: 0.5em;
    padding: 0.5em;
    background-color: gray;
    color: white;
	opacity: 0.8;
}

span:active+p.tooltip_timeout {
    display: inline-block;
}

span:hover+p.tooltip_timeout {
    display: inline-block;
}

span+p.tooltip_disable {
  	margin: 0.5em;
    position: fixed;
        display: none;
     border-radius: 0.5em;
    padding: 0.5em;
    background-color: gray;
    color: white;
	opacity: 0.8;
}

span:active+p.tooltip_disable {
    display: inline-block;
}

span:hover+p.tooltip_disable {
    display: inline-block;
}

span+p.tooltip_minimum {
  	margin: 0.5em;
    position: fixed;
        display: none;
     border-radius: 0.5em;
    padding: 0.5em;
    background-color: gray;
    color: white;
	opacity: 0.8;
}

span:active+p.tooltip_minimum {
    display: inline-block;
}

span:hover+p.tooltip_minimum {
    display: inline-block;
}

.delete_selected {
    width: 16em;
}

.export+p.tooltip_export {
  	margin: 0.5em;
    position: fixed;
        display: none;
     border-radius: 0.5em;
    padding: 0.5em;
    background-color: gray;
    color: white;
	opacity: 0.8;
}

.export:active+p.tooltip_export {
    display: inline-block;
}

.export:hover+p.tooltip_export {
    display: inline-block;
}

.export_link {
    display: none;
}

.import_file{
    display: none;
}

.import+p.tooltip_import {
  	margin: 0.5em;
    position: fixed;
        display: none;
     border-radius: 0.5em;
    padding: 0.5em;
    background-color: gray;
    color: white;
	opacity: 0.8;
}

.import:active+p.tooltip_import {
    display: inline-block;
}

.import:hover+p.tooltip_import {
    display: inline-block;
}

.sync_settings~p.tooltip_sync_status {
  	margin: 0.5em;
    position: fixed;
        display: none;
     border-radius: 0.5em;
    padding: 0.5em;
    background-color: gray;
    color: white;
	opacity: 0.8;
}

.sync_settings:active~p.tooltip_sync_status {
    display: inline-block;
}

.sync_settings:hover~p.tooltip_sync_status {
    display: inline-block;
}

.autosave_template {
	display: none;
	}

.autosave_header {
	font-size: small;
	background: black;
	color: white;
	}

.autosave_footer {
	font-size: small;
	background: white;
	color: black;
	overflow: hidden;
	}

.autosave {
     /*border-radius: 0.5em;*/
	/*background: lightblue;*/
  	border: 0.5em solid transparent;
  	/*margin: 0;*/
	max-width: 30%;
	/*resize: both;*/
	}

 .autosave_text:not(focus) {
	background: white;
	/*background: transparent;*/
	color: black;
 	display: block;
  	border: 1px dashed;
 	white-space: normal;
	min-height: 1em;
	max-height: 3em;
	overflow: hidden;
	/*resize: both;*/
	/*opacity: 0.5;*/
  }

/*.autosave_text:focus +  .autosave_text {
  }*/

 .autosave_text:focus {
	/*background: transparent;*/
	background: white;
	color: black;
 	display: inline-block;
 	/*float: left;*/
 /*position: absolute;
 left: 0;*/
	font-size: medium;
 	white-space: pre;
	padding-top: 3em;
	/*border-top: 3em solid gray;*/
	max-height: none;
	max-width: none;
	/*max-width: 30%;*/
	overflow: hidden;
	/*opacity: 0.98;*/
 }

.autosaves {
  	position: relative;
  	top: 11em;
  	padding: 0.1em;
 display: flex;
 flex-flow: row wrap;
  justify-content: flex-start;
	/*max-width: 30%;*/
  overflow: auto;
 }

.messages {
  	/*border: 0.1em dashed silver;*/
  	position: fixed;
  	padding: 0.1em;
  	color: red;
 bottom: 0;
 right: 0;
 /*left: 1em;*/
 display: inline-flex;
 flex-flow: row wrap;
  justify-content: flex-end;
  	margin: 0;
    /*TODO Please note http://developer.chrome.com/extensions/samples.html
    uses a z-index of 5 for the Feedback dogs-ear in the bottom right.*/
    z-index: 10;
 }
